<template>
	<view class="use">
		  <up-collapse
			@change="change"
			@close="close"
			@open="open"
			class="collapse"
		  >
			<up-collapse-item
			  title="医疗站点"
			  name="Docs guide"
			>
			  <text class="u-collapse-content">
				  该APP的医疗站点是由管理人员设置的医疗站点，点击出发即可开始导航，导航较小延迟，为一分钟一次，
				  用户可看到预计时间，全程大约距离和红绿灯个数。当然用户也可以点击地图组件的刷新，也可实时刷新自身位置。
				  到达医疗站点后，点击到达即可看到全程花费时间等信息，也可提前结束导航。
			  </text>
			</up-collapse-item>
			<up-collapse-item
			  title="目的地"
			  name="Variety components"
			>
			  <text class="u-collapse-content">
				  该APP的目的地是由用户输入的地址，点击出发即可开始导航，导航较小延迟，为一分钟一次，
				  用户可看到预计时间，全程大约距离和红绿灯个数。当然用户也可以点击地图组件的刷新，也可实时刷新自身位置。
				  到达目的地后，点击到达即可看到全程花费时间等信息，也可提前结束导航。
			  </text>
			</up-collapse-item>
			<up-collapse-item
			  title="退出登录"
			  name="Variety components"
			>
			  <text class="u-collapse-content">
					如果用户点击退出登录按钮，必须先确保已经结束定位，否则会一直实时刷新定位，造成API浪费。
			  </text>
			</up-collapse-item>
		  </up-collapse>
	</view>
</template>

<script setup>
// 定义 open 方法  
const open = (e) => {  
  // console.log('open', e)  
};  
  
// 定义 close 方法  
const close = (e) => {  
  // console.log('close', e)  
};  
  
// 定义 change 方法  
const change = (e) => {  
  // console.log('change', e)  
};  
</script>

<style scoped>
uni-page-body{
		height: 100%;
}
.use{
	display: flex;
	width: 750rpx;
	height: 100%;
	margin: 0 auto;
	background-color: #F7F7F7;
	box-sizing: border-box;
}
.collapse{
   width:700rpx;
   background-color: white;
   margin-left: 30rpx;
   margin-right: 30rpx;
   margin-top: 20rpx;
   border-radius: 20rpx;
   color: #7b7b7b;
   margin-bottom: 100rpx;
}
</style>
